﻿<%@ Page Title="Frontdesk - AutoResponder Editor" Language="C#" MasterPageFile="~/Views/Shared/Frontdesk.Master"
    Inherits="System.Web.Mvc.ViewPage<Sendz.Domain.AutoResponder>" %>

<asp:Content ContentPlaceHolderID="head" runat="server">
    <link href="<%= Url.Content("~/Content/jQuery-ui/custom-theme/jquery-ui-1.8.6.custom.css") %>"
        rel="stylesheet" type="text/css" charset="utf-8" media="screen" />
</asp:Content>
<asp:Content ContentPlaceHolderID="MainContent" runat="server">
    <h2>
        AutoResponder Editor</h2>
    <p class="justify">
        AutoResponders are used to automatically reply to users who fill out your forms.
        They can give the appearance of realtime, customized responses.
    </p>
    <div id="tabs">
        <ul>
            <li><a href="#tab-autoresponder">AutoResponder</a></li>
            <li><a href="#tab-attachments">Attachments</a></li>
        </ul>
        <div id="tab-autoresponder">
            <% using (Ajax.BeginForm("AutoResponder", null, new AjaxOptions { Url = "/AutoResponder/Edit", OnBegin = "onBegin", UpdateTargetId = "wrapper", InsertionMode = InsertionMode.Replace }, new { enctype = "multipart/form-data" }))
               { %>
            <div class="form-field">
                <div class="form-field-label">
                    <%: Html.LabelFor(f => f.Name)%>
                </div>
                <div class="form-field-error">
                    <%: Html.ValidationMessageFor(f => f.Name)%>
                </div>
                <div class="form-field-input">
                    <%: Html.TextBoxFor(f => f.Name, new { @class = "frontdesk" })%>
                </div>
            </div>
            <div class="form-field">
                <div class="form-field-label">
                    <%: Html.LabelFor(f => f.Subject)%>
                </div>
                <div class="form-field-error">
                    <%: Html.ValidationMessageFor(f => f.Subject)%>
                </div>
                <div class="form-field-input">
                    <div class="inline-help-group">
                        <%: Html.TextBoxFor(f => f.Subject, new { @class = "frontdesk" })%>
                        <% if (ViewData["FormFieldList"] != null && Convert.ToInt16(ViewData.Eval("FormFieldCount")) > 0)
                           { %>
                        <%: Html.DropDownList("FormFields_EmailSubject", new SelectList((IEnumerable)ViewData["FormFieldList"], "Value", "Text"), new { @class = "frontdesk-inlinechoice" })%>
                        <a href="javascript:;" onclick="insertAtCursor(document.getElementById('Subject'), document.getElementById('FormFields_EmailSubject').value);"
                            title="Insert this form field into your email subject so the value is included when the email is sent">
                            Insert Field</a><img src="<%= Url.Content("~/Content/Frontdesk/questionmark.png") %>"
                                class="inline-help" title="When you insert a field from the form that you have associated with this autoresponder, it will fill-in the actual value entered by the person who fills out the form when the email autoresponder is sent. This lets you make the response look very custom-tailored to that person."
                                alt="Help icon" />
                        <% } %></div>
                </div>
            </div>
            <div class="form-field">
                <div class="form-field-label">
                    <%: Html.LabelFor(f => f.FromName)%>
                </div>
                <div class="form-field-error">
                    <%: Html.ValidationMessageFor(f => f.FromName)%>
                </div>
                <div class="form-field-input">
                    <%: Html.TextBoxFor(f => f.FromName, new { @class = "frontdesk" })%>
                </div>
            </div>
            <div class="form-field">
                <div class="form-field-label">
                    <%: Html.LabelFor(f => f.FromEmail)%>
                </div>
                <% if (Convert.ToBoolean(ViewData.Eval("IsNewAutoResponder")))
                   { %>
                <p class="caption justify critical fullborder">
                    Note: If this is the first time you've used this email from address, a confirmation
                    email will be sent to you so you can validate it.</p>
                <% } %>
                <div class="form-field-error">
                    <%: Html.ValidationMessageFor(f => f.FromEmail)%>
                </div>
                <div class="form-field-input">
                    <div class="inline-help-group">
                        <%: Html.TextBoxFor(f => f.FromEmail, new { @class = "frontdesk" })%><img src="<%= Url.Content("~/Content/Frontdesk/questionmark.png") %>"
                            class="inline-help" title="In order to send emails from the email address that you enter here, you will have to receive a test email to that account and click a confirmation link in that email. Otherwise, this autoresponder won't work! This lets us know you own the email address you are sending from."
                            alt="Help icon" />
                    </div>
                </div>
            </div>
            <div class="form-field">
                <div class="form-field-label">
                    <%: Html.LabelFor(f => f.Body)%>
                </div>
                <div class="form-field-error">
                    <%: Html.ValidationMessageFor(f => f.Body)%>
                </div>
                <%: Html.TextAreaFor(f => f.Body, new { rows = "7", cols = "65" })%>
                <div class="inline-help-group">
                    <p class="caption clear">
                        Turn the WYSIWYG Editor [<a href="javascript:;" onclick="addEditor();" title="Turn the visual HTML editor on in your browser (works in most modern browsers)">ON</a>]
                        [<a href="javascript:;" onclick="removeEditor();" title="Turn the visual HTML editor off">OFF</a>]<img
                            src="<%= Url.Content("~/Content/Frontdesk/questionmark.png") %>" class="inline-help"
                            title="WYSIWYG help means 'What You See Is What You Get'. If your browser can support this type of editor, when you turn it on you should see some basic Word-like formatting controls including bullets, links, etc."
                            alt="Help icon" /></p>
                </div>
                <% if (ViewData["FormFieldList"] != null && Convert.ToInt16(ViewData.Eval("FormFieldCount")) > 0)
                   { %>
                <div class="inline-help-group">
                    <%: Html.DropDownList("FormFields_EmailBody", new SelectList((IEnumerable)ViewData["FormFieldList"], "Value", "Text"), new { @class = "frontdesk-inlinechoice" })%>
                    <a href="javascript:;" onclick="insertInNicEdit('Body', document.getElementById('FormFields_EmailBody').value);"
                        title="Insert this form field into your email body so the value is included when the email is sent">
                        Insert Field</a><img src="<%= Url.Content("~/Content/Frontdesk/questionmark.png") %>"
                            class="inline-help" title="When you insert a field from the form that you have associated with this autoresponder, it will fill-in the actual value entered by the person who fills out the form when the email autoresponder is sent. This lets you make the response look very custom-tailored to that person."
                            alt="Help icon" /></div>
                <% } %>
            </div>
            <div class="buttons">
                <%: Html.Hidden("UserKey", Model.UserKey)%>
                <%: Html.Hidden("AutoResponderKey", Model.AutoResponderKey)%>
                <%: Html.Hidden("IsNewAutoResponder", ViewData["IsNewAutoResponder"]) %>
                <input type="submit" class="button" value="Save AutoResponder" title="Save this autoresponder"
                    onclick="preSave();" />
                <input type="button" class="button" value="Cancel" title="Don't save this autoresponder, but return to the dashboard"
                    onclick="window.location = '/AutoResponder/List';" />
            </div>
            <% } %>
        </div>
        <div id="tab-attachments">
            <div class="form-field">
                <div class="form-field-label">
                    <div class="inline-help-group">
                        File Attachments<img src="<%= Url.Content("~/Content/Frontdesk/questionmark.png") %>"
                            class="inline-help" title="File attachments come across as individual files that are sent with your email. You will typically see them included with a paper clip icon next to the message name. An attached file may then be downloaded by the recipient. Valid files for attachment in Frontdesk end with .jpg, .gif, .png, .pdf, .doc, and .txt. Each file must be less than 100 kB in size, up to three per autoresponder."
                            alt="Help icon" />
                    </div>
                </div>
                <% if (Convert.ToBoolean(ViewData.Eval("IsNewAutoResponder")))
                   { %>
                <p class="caption justify">
                    Files may be attached to your autoresponder. Once you've created your autoresponder,
                    you may attach up to three files, less than 100 kB each, and they will be included
                    with the message delivered to your users.</p>
                <% }
                   else
                   { %>
                <p class="caption justify">
                    Files may be attached to your autoresponder. Simply use this upload tool to attach
                    up to three files, less than 100 kB each, and they will be included with the message
                    delivered to your users.</p>
                <div id="file-attachment-list">
                    <% foreach (var attachment in Model.Attachments)
                       { %>
                    <% Html.RenderPartial("file_attachment", attachment); %>
                    <%
                        } %>
                </div>
                <div class="form-field-error">
                </div>
                <div class="form-field-input upload" <% if (Model.Attachments.Count() >= 3) { %>style="display:none;"
                    <% } %>>
                    <form id="uploadForm" action="/AutoResponder/UploadFile" method="post" enctype="multipart/form-data">
                    <%: Html.HiddenFor(ar => ar.AutoResponderKey)%>
                    File:
                    <input type="file" name="file" class="frontdesk" />&nbsp;
                    <input type="submit" value="Upload File" class="button" />
                    </form>
                    <div id="uploadOutput">
                    </div>
                </div>
                <% } %>
            </div>
        </div>
    </div>
</asp:Content>
<asp:Content ContentPlaceHolderID="Sidebar" runat="server">
    <% Html.RenderPartial("videohelp"); %>
</asp:Content>
<asp:Content ContentPlaceHolderID="footer" runat="server">
    <script src="<%= Url.Content("~/Scripts/jquery.form.js") %>" type="text/javascript"></script>
    <script type="text/javascript" src="http://js.nicedit.com/nicEdit-latest.js"></script>
    <script type="text/javascript">
        // Enable jQuery UI tabs
        $("#tabs").tabs();
        // Handle the upload form post
        $('#uploadForm').ajaxForm({
            beforeSubmit: function (a, f, o) {
                o.dataType = 'html';
                // Start the loading indicator
                onBegin();
            },
            success: function (html) {
                // Stop the loading indicator
                onEnd();
                // Clear the form
                $(':input', '#uploadForm')
                 .not(':button, :submit, :reset, :hidden')
                 .val('')
                 .removeAttr('checked')
                 .removeAttr('selected')
                // Ensure a valid file_attachment control result returned
                if (html.indexOf('file-attachment') > -1) {
                    // Only allow new uploads when there are fewer then 3 files
                    if ($("#file-attachment-list > div.file-attachment").size() >= 2) {
                        $("div.upload").hide();
                    }
                    $("#file-attachment-list").append(html);
                    $(window).humanMsg("Your file attachment was uploaded");
                }
                else {
                    $(window).humanMsg("Sorry, that file cannot be uploaded (check file size or type)");
                }
            }
        });
        // Remove an attachment
        $("a.delete-file-attachment").live("click", function () {
            onBegin();
            if (confirm("Are you sure you wish to remove this attachment?")) {
                // For whatever reason, this does't work in the Ajax function, so do it here
                $(this).parents("div.file-attachment:first").remove();
                // Only allow new uploads when there are fewer then 3 files
                if ($("#file-attachment-list > div.file-attachment").size() < 3) {
                    $("div.upload").show();
                }
                $.ajax({
                    url: this.href,
                    cache: false,
                    success: function (data) {
                        if (data == 'True') {
                            // Hide the delete option on the last form field
                            $(window).humanMsg("Your file attachment was deleted");
                        }
                        else {
                            $(window).humanMsg("Your file attachment may not have been permanently deleted, please try again later");
                        }
                    }
                });
            }
            onEnd();
            return false;
        });
        //<![CDATA[
        var editorArea;
        function addEditor() {
            editorArea = new nicEditor({ buttonList: ['bold', 'italic', 'underline', 'strikeThrough', 'subscript', 'superscript', 'link', 'unlink', 'ul', 'ol'] }).panelInstance('Body'); // { fullPanel: true }
        }
        function removeEditor() {
            editorArea.removeInstance('Body');
        }
        //]]>
        function preSave() {
            if (nicEditors.findEditor('Body') != null) {
                $('#Body').val(nicEditors.findEditor('Body').getContent()); // used escape() previously
            }
        }
    </script>
</asp:Content>
